<template>
	<view class="home">
		<view class="box">
			<view class="box_list">
				<view class="flex_lr list">
					<view class="f1">订单号</view>
					<view class="f1">{{order_no}}</view>
				</view>
				<view class="flex_lr list">
					<view class="f1">物流公司</view>
					<view class="f1">{{express_name}}</view>
				</view>
				<view class="flex_lr list" style="border: none;">
					<view class="f1">快递单号</view>
					<view class="flex_row">
						<view class="f1">{{express_no}}</view>
						<view class="copy" @click="copy">复制</view>
					</view>
				</view>
			</view>
		</view>
		<view class="box box_list" style="position: relative;">
			<view class="xian"></view>
			<view class="flex" v-for="(item,index) in data" :key="index" style="margin-top: 20rpx;">
				<image class="box_list_img" src="/static/board/wl.png" mode=""></image>
				<view class="flex-one">
					<view>
						<view>{{item.status}}</view>
						<view>{{item.ftime}}</view>
					</view>
					<view>{{item.context}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: [],
				id: '',
				order_no: '',
				express_name: '',
				express_no: '',
				type: ""
			}
		},
		onLoad(e) {
			if ('id' in e) {
				this.id = e.id
			}
			if ('order_no' in e) {
				this.order_no = e.order_no
			}
			if ('express_name' in e) {
				this.express_name = decodeURIComponent(e.express_name)
			}
			if ('express_no' in e) {
				this.express_no = e.express_no
			}
			this.type = e.type ? e.type : ""
			this.init()
		},
		methods: {
			init() {
				if (this.type == 1) {
					this.rq.getData('sign/express_info', {
						id: this.id
					}).then(res => {
						if (res.code == 1) {
							// this.cn.toast(res.msg)
							this.data = res.data.data
							console.log(this.data)
						}
					})
				} else {
					this.rq.getData('Memorder/express_info', {
						id: this.id
					}).then(res => {
						if (res.code == 1) {
							// this.cn.toast(res.msg)
							this.data = res.data.data
							console.log(this.data)
						}
					})
				}

			},
			copy() {
				uni.setClipboardData({
					data: this.express_no, // e是你要保存的内容
					success: function() {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		margin: 40rpx;
	}

	.f1 {
		font-size: 30rpx;
		font-weight: bold;
	}

	.box_list_img {
		width: 70rpx;
		height: 70rpx;
		border-radius: 50%;
		margin-right: 20rpx;
		position: relative;
		z-index: 2;
	}

	.box_list {
		background: #FFF;
		box-shadow: 5px 5px 10px 0 rgba(186, 186, 186, 0.4);
		border-radius: 30px;
		padding: 20rpx 40rpx 20rpx 40rpx;

		.list {
			min-height: 100rpx;
			padding-bottom: 10rpx 0;
			margin-bottom: 10rpx;
			border-bottom: 2rpx solid #d1d1d1;

			.list_input {
				text-align: right;
			}
		}

		.f2 {
			font-size: 26rpx;
		}

		.f3 {
			font-size: 75rpx;
		}

		.up_img {
			width: 180rpx;
			height: 180rpx;
			border-radius: 10px;
			background-color: #f3f5f7;
		}
	}

	.xian {
		position: absolute;
		left: 70rpx;
		top: 40rpx;
		z-index: 1;
		height: 90%;
		border: 1rpx dashed #e8e8e8;
	}

	.copy {
		font-size: 26rpx;
		padding: 6rpx 20rpx;
		border: 1rpx solid #000;
		border-radius: 30rpx;
		margin-left: 20rpx;
	}
</style>